<template>
	<view class="mypage">
		<view class="top">
			<u-avatar :src="userInfo.avatar||''" size="75" mode="aspectFill"></u-avatar>
			<view class="info">
				<view class="tit">
					<view style="font-weight: bold;font-size: 32rpx;">{{userphone||'--'}}</view>
					<view style="display: flex;align-items: center;" @click="pageTo('/pagesC/mine/edit')">
						<text style="color: #999;">编辑资料</text>
						<u-icon name="arrow-right" color="#999"></u-icon>
					</view>
				</view>
				<view class="sp" v-if="userInfo.role">
					<text>{{userInfo.role}}</text>
				</view>
			</view>
		</view>
		
		<view class="list">
			<view style="background: #fff;">
				<u-cell-group :border="false">
					<u-cell title="实名认证" isLink :border="true" @click="pageTo('/pagesC/mine/autent')">
						<template #icon>
							<image src="https://jsgl.zfcxjw.cq.gov.cn:28082/prod-api/profile/upload/2025/06/21/img8_20250621080927A256.png" class="icons"></image>
						</template>
					</u-cell>
					<u-cell title="消息通知" isLink :border="true" @click="pageTo('/pagesC/mine/msg')">
						<template #icon>
							<image src="https://jsgl.zfcxjw.cq.gov.cn:28082/prod-api/profile/upload/2025/06/21/img9_20250621080950A257.png" class="icons"></image>
						</template>
					</u-cell>
					<u-cell title="技术支持" isLink :border="true" @click="pageTo('/pagesC/mine/tss')">
						<template #icon>
							<image src="https://jsgl.zfcxjw.cq.gov.cn:28082/prod-api/profile/upload/2025/06/21/img10_20250621081017A258.png" class="icons"></image>
						</template>
					</u-cell>
					<u-cell title="意见反馈" isLink :border="false" @click="pageTo('/pagesC/mine/feedback')">
						<template #icon>
							<image src="https://jsgl.zfcxjw.cq.gov.cn:28082/prod-api/profile/upload/2025/06/21/img11_20250621081036A259.png" class="icons"></image>
						</template>
					</u-cell>
				</u-cell-group>
			</view>
		
			<view class="button" @click="userEdit()">退出登录</view>
		</view>
	</view>
</template>

<script setup>
import { ref } from 'vue';
import { onShow } from "@dcloudio/uni-app";

const userphone = uni.getStorageSync('phone')||''
const userInfo = ref({})

//页面跳转
function pageTo(url){
	if(url){
		uni.navigateTo({
			url: url
		})
	}
}

//退出登录
function userEdit(){
	uni.showModal({
		content: "是否确定退出登录",
		success: (res) => {
			if (res.confirm) {
				uni.removeStorageSync("token")
				uni.removeStorageSync("phone")
				uni.removeStorageSync('userInfo')
				// uni.removeStorageSync('role')
				uni.removeStorageSync('activeProject')
				uni.reLaunch({
					url: "/pages/login/index"
				})
			}
		}
	})
}

onShow(()=>{
	userInfo.value = uni.getStorageSync('userInfo') || {}
	console.log(userInfo.value)
})
</script>

<style lang="less">
page{
	background: #f8f8f8;
}
.mypage{
	.top{
		background: #E1EFFE;
		padding: 40rpx 30rpx;
		display: flex;
		align-items: center;
		.head{
			width: 150rpx;
			height: 150rpx;
			border-radius: 50%;
		}
		.info{
			flex: 1;
			padding-left: 30rpx;
			.tit{
				font-size: 28rpx;
				display: flex;
				align-items: center;
				justify-content: space-between;
			}
			.sp{
				margin-top: 30rpx;
				text{
					display: inline-block;
					background: #EFEFEF;
					color: #666;
					font-size: 28rpx;
					padding: 8rpx 20rpx;
				}
			}
		}
	}
	.list{
		.icons{
			width: 40rpx;height: 40rpx;margin-right: 20rpx;
		}
		.button{
			background: #fff;
			margin-top: 30rpx;
			text-align: center;
			height: 100rpx;
			line-height: 100rpx;
			color: #888;
			font-size: 30rpx;
		}
		::v-deep .u-cell__body{
			padding: 40rpx 30rpx;
		}
	}
}
</style>